<template>
    <div class="container">
        <div class="content">
            <a-result class="result" status="404" title="404 Error" subtitle="您访问的页面不存在,如有疑问请联系管理员~" />
            <div class="operation-row">

                <a-button key="back" type="primary" @click="back()">
                    返回
                </a-button>
            </div>
        </div>
    </div>
</template>

<script lang="ts" setup>
import router from '@/router/router';
const back = () => {
    router.go(-1);
}
</script>

<script lang="ts">
export default {
    name: '404',
};
</script>

<style scoped lang="less">
.container {
    padding: 0 20px 20px 20px;
    height: calc(100vh - 100px);

    :deep(.content) {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100%;
        text-align: center;
        background-color: var(--color-bg-1);
        border-radius: 4px;
    }
}
</style>